<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>审批单</title>
    <style>
        table{
            position: absolute;
            left: 300px;
            border: 2px solid black;
            width: 800px;
            height: 700px;
            border-collapse: collapse;
        }
        th{
            border: 1px solid black;
        }
        td{
            border: 1px solid black;
            padding: 0px;
            text-align: center;
        }
        tr > th{
            height: 100px;
            text-align: center;
            font-size: 30px;
        }
        .people{
            display: flex;
            height: 100px;
            justify-content: space-between;
            align-items: center;
            margin: 0 50px;
            padding: 0;
        }
        .status{
            margin-top: 10px;
            margin-left: 250px;
            font-size: 25px;
        }
        .finish{
            margin-left: 600px;
            margin-bottom: 20px;
            margin-top: 10px;
        }
    </style>
</head>
<body>
<table>
    <tr>
        <th colspan="4">审批表</th>
    </tr>
    <tr style="height: 100px">
        <td style="font-weight: bold;text-align: center">员工姓名</td>
        <td>{{ appr.staff.name }}</td>
        <td style="font-weight: bold;text-align: center">员工编号</td>
        <td>{{ appr.staff.num }}</td>
    </tr>
    <tr style="height: 100px">
        <td style="font-weight: bold;text-align: center">审批id</td>
        <td>{{ appr.appr_id }}</td>
        <td style="font-weight: bold;text-align: center">审批编号</td>
        <td>{{ appr.num }}</td>
    </tr>
    <tr>
        <td style="font-weight: bold;text-align: center">审批类型</td>
        <td>{{ appr.appr_kind }}</td>
        <td style="font-weight: bold;text-align: center">审批时间</td>
        <td>{{ appr.start_time }}</td>
    </tr>
    <tr>
        <td colspan="4" style="height: 100px">
            <div class="people">
                <div>
                    {{ appr1.staff.name }}
                </div>
                <div>
                    {{ appr1.content }}
                </div>
                <div>
                    {{ appr1.appr_time }}
                </div>
            </div>
        </td>
    </tr>
    <tr>
        <td colspan="4" style="height: 100px">
           <div class="people">
                <div>
                    {{ appr2.staff.name }}
                </div>
                <div>
                    {{ appr2.content }}
                </div>
                <div>
                    {{ appr2.appr_time }}
                </div>
            </div>
        </td>
    </tr>
    <tr style="height: 100px">
        <td colspan="4" style="text-align: left">
            <div class="status">
                {{ appr.status }}
            </div>
            <div class="finish">
                {{ appr.finish_time }}
            </div>
        </td>
    </tr>
</table>
</body>
</html>